<template>
<div 
    class="img-color"
    :style="{
        backgroundColor:color,
    }">
    <Copy
        class="copy-bt"
        title="Copy"
        :content="color">
    </Copy>
</div>
</template>

<script>
/*
 用来显示img的颜色
 */
import Copy from '@/components/other/Copy';
export default {
    components: {
        Copy,
    },
    props:{
        color:{  //color数据
            type:String,
            default:"",
        },
    },
    data(){
        return{};
    },
}
</script>
<style lang="scss" scoped>
.img-color{
    width: 100%;
    height: 100%;
    transition: all 0.2s;
    background-color:#ffffff;
    position: relative;
    /deep/.copy-bt{
        width: fit-content;
        position: absolute;
        bottom: 0;
        left: 0;
        opacity: 0;
        transition: all 0.2s;
        border-radius: 0px 3px 0 0;
        font-size: 1.3rem;
    }
    &:hover{
        /deep/.copy-bt{
            opacity: 1;
        }
    }
}
</style>

